<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>

</head>
<body>
    <form>
        用户名 <input type="text" name="name" id="name">
        <input value="登录" type="button" onclick="submitName()">
    </form>

    <script>
        function submitName() {
            var name = document.getElementById("name").value;
            console.log(name);
            if(name === null || name === "" || typeof name === "undefined"){
                alert("请输入用户名");
            } else {
                var request = new XMLHttpRequest();
                request.onreadystatechange = function(){
                    // readyState 表示请求的状态
                    // 0 未初始化，未调用open方法
                    // 1 正在加载，对象已经初始化，尚未调用send方法
                    // 2 请求已经发送，send方法已调用
                    // 3 请求处理中
                    // 4 请求已经完成
                    if(request.readyState === 4){
                        if (request.status === 200){
                            // statusText  响应行
                            // responseText  响应内容 字符串格式
                            // responseXML  响应内容 XML格式
                            window.location.href="/webstudy/static/hello.html?name="+name;
                        }
                    }
                }
                request.open("GET","http://localhost:8080/webstudy/login?name="+name);
                request.send();
            }

        }
    </script>
</body>
</html>